<script setup></script>

<template>
  <div>
    <van-image width="100%" height="400" src="/img/success.png" />
    <div class="title">您的订单已经发货！</div>
    <van-divider>更多推荐商品</van-divider>
    <div>
      <van-image
        width="46%"
        height="300"
        class="image-left"
        src="https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg"
      />
      <van-image
        width="46%"
        height="300"
        src="https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg"
      />
    </div>
    <div>
      <van-image
        width="46%"
        height="300"
        class="image-left"
        src="https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg"
      />
      <van-image
        width="46%"
        height="300"
        src="https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg"
      />
    </div>
    <div>
      <van-image
        width="46%"
        height="300"
        class="image-left"
        src="https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg"
      />
      <van-image
        width="46%"
        height="300"
        src="https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg"
      />
    </div>
    <div>
      <van-image
        width="46%"
        height="300"
        class="image-left"
        src="https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg"
      />
      <van-image
        width="46%"
        height="300"
        src="https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg"
      />
    </div>
  </div>
</template>

<style scoped>
.title {
  text-align: center;
  font-size: 30px;
  margin-top: 20px;
  color: lightsteelblue;
}
.image-left {
  margin-left: 10px;
  margin-right: 10px;
}
</style>
